/*
 * @Author: LiuYan 15136056318@163.com
 * @Date: 2023-11-30 09:19:10
 * @LastEditors: LiuYan 15136056318@163.com
 * @LastEditTime: 2023-12-07 14:19:26
 * @FilePath: \react-template_pc\src\pages\demo\index.tsx
 * @Description:
 */
import Tabs from '@/components/tabs'
const Demo = () => {
  return (
    <>
      <div>
        <Tabs
          style={{ width: 'fit-content' }}
          defaultActiveIndex={1}
          onChange={(index, target) => {
            return (
              <div
                style={{
                  width: target.clientWidth + 'px',
                  height: target.clientHeight + 'px',
                  display: 'flex',
                  justifyContent: 'center',
                  alignItems: 'center',
                  background: '#ffffff',
                  boxShadow: '0px 0px 16px 0px rgba(0, 88, 247, 0.2)',
                  borderRadius: '40px 40px 40px 40px',
                  color: '#3c73e4',
                }}
                dangerouslySetInnerHTML={{
                  __html: target.innerHTML,
                }}
              ></div>
            )
          }}
        >
          <Tabs.item>tab01</Tabs.item>
          <Tabs.item>tab02</Tabs.item>
        </Tabs>
      </div>
    </>
  )
}
export default Demo
